@media screen and (max-width: 500px) {
    .head {
        height: 1rem;
    }
    .head .img {
        margin-left: 0.27rem;
        margin-top: 0.3rem;
    }
    .head .button .btn{
        margin-top: 0.2rem;
        font-size: 14px;
    }
    .shouye {
        margin-top: 1rem;
    }
    .shouye .jiefang {
        height: 8.67rem;
        background: url('../images/首页背景图.png') no-repeat;
        background-size: 100% 100%;
        overflow: hidden;
    }
    .shouye .jiefang .img{
        width: 3.08rem;
        height: 0.63rem;
        background: url('../images/logo2.png') no-repeat;
        background-size: 100% 100%;
        margin-top: 2rem;
        margin-left: 0.48rem;
    }
    .shouye .jiefang .title1 {
        margin-left: .48rem;
        margin-top: 0.45rem;
    }
    .shouye .jiefang .title2 span {
        font-size: 0.24rem;
        font-weight: 800;
    }
    .shouye .jiefang .title2 {
        width: 5.28rem;
        margin-left: .48rem;
        font-size: 0.24rem;
        line-height: 0.4rem;
        font-weight: 500;
        margin-top: 0.15rem;
    }
    .shouye .jiefang .ma {
        margin-left: .48rem;
        margin-top: .28rem;
    }
    .shouye .jiefang .ma img {
        width: 1.58rem;
        height: 1.58rem;
        margin-right: 0.4rem;
    }
    .shouye .jiefang .text {
        margin-left: .48rem;
        margin-top: .09rem;
        display: flex;
    }
    .shouye .jiefang .text div {
        text-align: center;
        font-size: .16rem;
        width: 1.58rem;
        margin-right: 0.4rem;
    }
    .shouye .jiefang .shui {
        margin-left: 0.5rem;
        margin-top: .68rem;
    }
    .shouye .jiefang .shui img {
        width: 1.65rem;
        height: 0.5rem;
    }
    .shouye .tese {
        position: relative;
        padding-bottom: 0.42rem;
        overflow: hidden;
    }
    .shouye .tese .blur {
        position: absolute;
    }
    .shouye .tese .blur1 {
        top:0.55rem;
        left:0.2rem;
        width: 1.13rem;
        height: 1.13rem;
    }
    .shouye .tese .blur2 {
        top:0.72rem;
        right: 0;
        width: 2rem;
        height: 2.6rem;
    }
    .shouye .tese .title1 {
        margin-top: 0.8rem;
        color: #3E3A39;
        text-align: center;
    }
    .shouye .tese .title2 {
        font-size: 0.42rem;
        letter-spacing: 0.1rem;
        font-weight: bolder;
        text-align: center;
        margin-top: 0.16rem;
    }
    .shouye .tese .images{
        margin-top: 0.51rem;
        position: relative;
        z-index: 10;
        padding: 0 .6rem;
    }
    .shouye .tese .item img{
        width: 1.78rem;
        height: 2rem;
    }
    .shouye .tese .item .tit {
        position: absolute;
        left: 1rem;
        bottom: 1.1rem; 
        font-size: .2rem;;
        color: #19181E;
        letter-spacing: .05rem;
    }
    .app .life {
        position: relative;
    }
    .app .life .bg {
        width: 10.3rem;
        height: 6.23rem;
        background: url('../images/APP介绍背景图1.png') no-repeat;
        background-size: 100% 100%;
        border-top: 1px solid transparent;
        position: relative;
    }
    .app .life .bg .im1 {
        left: 7.08rem;
        top: 1.7rem;
    }
    .app .life .bg .im2 {
        left: 0.51rem;
        top: 0.5rem;
    }
    .app .life .bg .title1 {
        letter-spacing: 0.02rem;  
        color: #3E3A39;
        margin-left: 1.37rem;
        margin-top: 0.73rem;
    }
    .app .life .bg .title2 {
        font-size: 0.32rem;
        font-weight: 800;
        color: #613A01;;
        margin-left: 1.37rem;  
    }
    .app .life .bg .title3 {
        width: 7.14rem;
        line-height: 0.5rem;
        font-size: 0.24rem;
        color: #613A01;
        margin-left: 1.37rem;
        margin-top: 0.15rem;
        
    }
    .app .life .images {
        position: relative;
        display: flex;
        justify-content: space-between;
        margin-left: 0rem;
        margin-top: -3rem;
        z-index: 2;
    }
    .app .life .images img {    
        width: 2.85rem;
        height: 4.85rem;
    }
    .app .life .images .title1 {    
        font-size: 0.26rem;
        color: #3E3A39;
        margin-left: .5rem;
    }
    .app .life .images .title2 {    
        font-size: 0.16rem; 
        color: #A06610;
        margin-left: .5rem;
        margin-top: 0.13rem;
    }
    .app .life .blur {
        width: 2.02rem;
        height: 2.17rem;
        position: absolute;
        left: 0;
        bottom: -.5rem;
    }
    .shequ {
        margin-top: 3.14rem;
        height: 4.5rem;
        background: #FFCC00;
        position: relative;
        border-top: 1px solid #FFCC00;
    }
    .shequ .shouji {
        position: absolute;
        right: 0.29rem;
        top: -2rem;
        width: 4.06rem;
        height: 7.41rem;
        z-index: 10;
    }
    .shequ .hua {
        position: absolute;
        left: 0.83rem;
        top: -1.54rem;
        width: 1.54rem;
        height: 1.54rem;
    }
    .shequ .blur {
        position: absolute;
        right: 0rem;
        top: -3rem;
        width: 1.73rem;
        height: 2.43rem;
    }
    .im {
        width: 1.35rem;
        height: 1.06rem;
        position: absolute;
    }
    .shequ .im1 {
        left: 5.08rem;
        top: 2rem;
    }
    .shequ .im2 {
        left: 0.51rem;
        top: 0.79rem;
    }
    .shequ .dh1 {
        width: 3.68rem;
        height: 1.5rem;
        top: -.9rem;
        left: 4.67rem;
        z-index: 20;
        /* opacity: 0; */
    }
    .shequ .dh2 {
        width: 4rem;
        height: 1.5rem;
        bottom: -.5rem;
        left: 3.8rem;
        z-index: 20;
        /* opacity: 0; */
    }
    .shequ .title {
        position: relative;
        z-index: 10;
        margin-left: 1.29rem;
    }
    .shequ .title1 {
        color: #3E3A39;
        margin-top: 1.12rem;
    }
    .shequ .title2 {
        font-size: 0.32rem;    
        font-weight: 800;
        color: #3E3A39;
    }
    .shequ .title3 {
        font-size: 0.24rem;     
        color: #3E3A39;
        margin-top: 0.2rem;
        width: 5.1rem;
        line-height: 0.4rem;
    }
    .xiaoqu {
        height: 4.5rem;
        background: #FFCC00;
        margin-top: 3.83rem;
        position: relative;
        border-top: 1px solid #FFCC00;
    }
    .xiaoqu .shouji {
        position: absolute;
        left: .8rem;
        top: -2rem;
        width: 4.05rem;
        height: 7.41rem;
        z-index: 10;
    }
    .xiaoqu .hua {
        position: absolute;
        right: 0.93rem;
        top: -2rem;
        width: 1.72rem;
        height: 2.66rem;
    }
    .xiaoqu .blur {
        position: absolute;
        left: 0rem;
        top: -2.8rem;
        width: 2.05rem;
        height: 2.09rem;
    }
    .xiaoqu .im1 {
        left: 9rem;
        bottom: 1.1rem;
    }
    .xiaoqu .im2 {
        left: 5rem;
        top: 1.08rem;
    }
    .xiaoqu .title {
        position: relative;
        z-index: 10;
        margin-left: 5.5rem;
    }
    .xiaoqu .title1 {
        color: #3E3A39;
        margin-top: 1.41rem;
    }
    .xiaoqu .title2 {
        font-size: 0.32rem;    
        font-weight: 800;
        color: #3E3A39;
        font-weight: 800;
    }
    .xiaoqu .title3 {
        font-size: 0.24rem; 
        color: #3E3A39;
        margin-top: 0.2rem;
        width: 4.72rem;
        line-height: 0.4rem;
    }
    .xiaoqu .dh3 {
        width: 2.59rem;
        height: 1.5rem;
        bottom: -.9rem;
        left: 3.5rem;
        z-index: 20;
    }
    .xiaoqu .dh4 {
        width: 2.59rem;
        height: 1.5rem;
        bottom: 0rem;
        left: 0rem;
        z-index: 20;
    }
    .xiaoqu .dh5 {
        width: 2.59rem;
        height: 1.5rem;
        top: -.7rem;
        left: 3rem;
        z-index: 20;
    }
    .fuwu {
        width: 100%;
        height: 5.42rem;
        background: url('../images/社区服务3.png') no-repeat;
        background-size: 100% 100%;
        border-top: 1px solid transparent;
        margin-top: 3.88rem;
        position: relative;
        text-align: center;
    }
    .fuwu .city{
        width: 10.45rem;
        height: 1.8rem;
        background: url('../images/美好街坊.png') no-repeat;
        background-size: 100% 100%;
        border-top: 1px solid transparent;
        position: absolute;
        top: -2rem;
        margin-left: .4rem;
    }
    .fuwu .city .title1 {
        color: #3E3A39;
        letter-spacing: 0.02rem;
        margin-top: 1.1rem;
    }
    .fuwu .city .title2 {
        font-weight: 800;
        color: #3E3A39;
        font-size: 0.32rem;   
        font-weight: 800;
    }
    .fuwu .title3 {
        font-size: 0.24rem;
        color: #3E3A39;
        line-height: 0.35rem;
        width: 7.2rem;
        margin: 0.08rem auto;
    }
    .we {
        text-align: center;
    }
    .we>.title1 {
        letter-spacing: 0.02rem;
        color: #3E3A39;
        margin-top: 0.8rem;
    }
    .we>.title2 {
        font-size: 0.42rem;  
        color: #3E3A39;
        letter-spacing: .1rem;
        margin-top: 0.16rem;
        font-weight: bolder;    
        font-family: PingFang-SC-Heavy, PingFang-SC;
    }
    .we .btnimg {
        margin-top: 0.6rem;
        display: flex;
        justify-content: space-between;
        padding: 0 .5rem;
    }
    .we .btnimg img {
        width: 3rem;
        height: 3rem;
    }
    .we .btnimg img:hover {
        box-shadow: .1rem .1rem .4rem .1rem #ccc;
    }
    .we .btnimg img:hover {
        cursor: pointer;
    }
    .we .box {
        padding: 0 .5rem;
        margin-top: 0.77rem;
        display: none;
    }
    .we .box .title1 {
        font-size: .3rem;
        font-weight: bold;
        color: #764904;
        text-align: left;
    }
    .we .box .title2 {
        font-size: 0.24rem;
        font-weight: 400;
        color: #764904;
        margin: 0.05rem 0;
        text-align: left;
    }
    .we .box .cont {
        height: 8.5rem;
        background: #F2F2F2;
        margin-top: 0.15rem;
        text-align: left;
    }
    .we .box .cont p {
        font-size: 0.24rem;
        /* font-weight: bold; */
        color: #3E3A39;
        line-height: 0.33rem;
        padding: 0 0.19rem;
        line-height: .4rem;
    }
    .we .box2 .cont {
        padding-top: .2rem;
    }
    .we .box1 .cont p {
        margin-bottom: .2rem;
    }
    .we .box1 .cont p:nth-child(2) {
        margin-top: .2rem;
    }
    .we .box2 .cont p:nth-child(odd) {
        margin-top: .2rem;
    }
    .we .box2 .cont p:first-child {
        margin-bottom: .2rem;
    }
    .we .box3 .cont p {
        padding: 0rem 0.4rem;
        line-height: .6rem;
    }
    .we .box3 .cont p:nth-child(2) {
        margin-top: .34rem;
        font-size: .3rem;
    }
    .we .box1 img, .we .box3 img {
        width: 100%;
    }
    .we .box1 img {
        height: 2.4rem;
    }
    .we .box3 img {
        height: 3rem;
    }
    .footer {
        height: .8rem;
        background: #3E3A39;
        margin-top: 0.77rem;
        padding: 0;
        line-height: .8rem;
    }
    .footer .cont {
        font-size: 0.22rem;
        margin-left: 1rem;
        color: #ddd;
    }
    .footer .cont a{
        color: #A6A6A6;
        font-size: 0.22rem;
        padding: 0 5px;
        border-right: 1px solid #A6A6A6;
    }
    .footer .cont a:last-child {
        border: none;
    }
}